var app = angular.module('myApp', ['ngGrid']);
app.controller('MyCtrl', function($scope, $http) {
	csvOpts = { columnOverrides: { obj: function(o) {
	 return o.a + '|' +  o.b; }
		 } }

	hgtOpts = { minHeight: 1400 }  ;
    $scope.filterOptions = {
        filterText: "",
        useExternalFilter: false
    };
	
    $scope.totalServerItems = 0;
    $scope.pagingOptions = {
        pageSizes: [50, 100, 150],
        pageSize: 50,
        currentPage: 1
    };  
    $scope.setPagingData = function(data, page, pageSize){	
        var pagedData = data.slice((page - 1) * pageSize, page * pageSize);
        $scope.myData = pagedData;
        $scope.totalServerItems = data.length;
        if (!$scope.$$phase) {
            $scope.$apply();
        }
    };
    $scope.getPagedDataAsync = function (pageSize, page, searchText) {
        setTimeout(function () {
            var data;
            if (searchText) {
                var ft = searchText.toLowerCase();
				alert();
                $http.get("data.php").success(function (largeLoad) {		
                    data = largeLoad.filter(function(item) {
                        return JSON.stringify(item).toLowerCase().indexOf(ft) != -1;
                    });
                    $scope.setPagingData(data,page,pageSize);
                });            
            } else {
                $http.get("data.php").success(function (largeLoad) {
                    $scope.setPagingData(largeLoad,page,pageSize);
                });
            }
        }, 100);
    };

		$scope.refreshGrid = function() {
			$scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage);
		};	


    $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage);
	
    $scope.$watch('pagingOptions', function (newVal, oldVal) {
        if (newVal !== oldVal && newVal.currentPage !== oldVal.currentPage) {
          $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage, $scope.filterOptions.filterText);
        }
    }, true);
    $scope.$watch('filterOptions', function (newVal, oldVal) {
        if (newVal !== oldVal) {
          $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage, $scope.filterOptions.filterText);
        }
    }, false);
	
    $scope.gridOptions = {
        data: 'myData',
		columnDefs: [{field:'Referenceno', displayName:'Ref no', width:"50"},{field:'Date', displayName:'Date'},{field:'Dist_Name', displayName:'Client Name',width: 200, cellTemplate: '<div style="text-align:left;" class="ngCellText">{{row.getProperty(col.field)}}</div>'},{field:'custtype', displayName:'Type'},{field:'Business', displayName:'Business'},{field:'Net_Rate', displayName:'Net Rate', cellTemplate: '<div style="text-align:right;" class="ngCellText">{{row.getProperty(col.field)}}</div>'},{field:'Dr_Amount', displayName:'Debit', cellTemplate: '<div style="text-align:right;" class="ngCellText">{{row.getProperty(col.field)}}</div>'},{field:'Cr_Amount', displayName:'Credit', cellTemplate: '<div style="text-align:right;" class="ngCellText">{{row.getProperty(col.field)}}</div>'},{field:'Bank', displayName:'Bank'},{field:'Branch', displayName:'Branch'},{field:'payid', displayName:'Payment Mode'},{field:'paydate', displayName:'Pay Date'},{field:'remarks', displayName:'Remarks'},{field:'IDNumber', displayName:'PNR Number'},{field:'enteredby', displayName:'Entered By'},{displayName: 'T.Details Add', cellTemplate: '<img src=images/detail.png title="Transaction Details Add" name="edit" onclick="editdata(\'TransactionDetails.php?tranid={{row.entity.Referenceno}}&up=true&flag=1\')" value="Edit"> '},{displayName: 'Action', cellTemplate: '<img src=glyphicons_bin.png title="Delete" name="delete" onclick="deletedata(\'{{row.entity.Referenceno}} \')" value="Del"> | <img src=glyphicons_edit.png title="Edit" name="edit" onclick="editdata(\'transactionedit.php?id={{row.entity.Referenceno}}&up=true\')" value="Edit">'}],
		plugins: [new ngGridCsvExportPlugin(csvOpts)],
		showGroupPanel: true,
        showFilter: false,
        enablePaging: true,
        showFooter: true,
		enableCellEdit: false,
        multiSelect: false,
		enableColumnResize: true,
		enableCellSelection: true,
        totalServerItems:'totalServerItems',
        pagingOptions: $scope.pagingOptions,
        filterOptions: $scope.filterOptions,
		jqueryUITheme: true
    };
	
     $scope.gridOptionsView = {
        data: 'myData',
        //columnDefs: [{field:'Referenceno', displayName:'Ref no', width:"50"},{field:'Date', displayName:'Date'},{field:'Dist_Name', displayName:'Client',width: 200, cellTemplate: '<div style="text-align:left;" class="ngCellText">{{row.getProperty(col.field)}}</div>'},{field:'custtype', displayName:'Type'},{field:'Business', displayName:'Business'},{field:'Sub_Category', displayName:'Category'},
		//{field:'Sub_delear', displayName:'Sub-Agent Name'},{field:'Dr_Amount', displayName:'Debit', cellTemplate: '<div style="text-align:right;" class="ngCellText">{{row.getProperty(col.field)}}</div>'},{field:'Cr_Amount', displayName:'Credit', cellTemplate: '<div style="text-align:right;" class="ngCellText">{{row.getProperty(col.field)}}</div>'},{field:'Bank', displayName:'Bank'},{field:'Branch', displayName:'Branch'},{field:'payid', displayName:'Payment Mode'},{field:'paydate', displayName:'Pay Date'},{field:'remarks', displayName:'Remarks', cellTemplate: '<div style="text-align:left;" class="ngCellText">{{row.getProperty(col.field)}}</div>'}],
columnDefs: [{field:'Referenceno', displayName:'Ref no', width:"50"},{field:'Date', displayName:'Date'},{field:'Dist_Name', displayName:'Client Name',width: 200, cellTemplate: '<div style="text-align:left;" class="ngCellText">{{row.getProperty(col.field)}}</div>'},{field:'custtype', displayName:'Type'},{field:'Business', displayName:'Business'},{field:'Net_Rate', displayName:'Net Rate', cellTemplate: '<div style="text-align:right;" class="ngCellText">{{row.getProperty(col.field)}}</div>'},{field:'Dr_Amount', displayName:'Debit', cellTemplate: '<div style="text-align:right;" class="ngCellText">{{row.getProperty(col.field)}}</div>'},{field:'Cr_Amount', displayName:'Credit', cellTemplate: '<div style="text-align:right;" class="ngCellText">{{row.getProperty(col.field)}}</div>'},{field:'Bank', displayName:'Bank'},{field:'Branch', displayName:'Branch'},{field:'payid', displayName:'Payment Mode'},{field:'paydate', displayName:'Pay Date'},{field:'remarks', displayName:'Remarks'},{field:'IDNumber', displayName:'PNR Number'},{field:'enteredby', displayName:'Entered By'},{displayName: 'T.Details Add', cellTemplate: '<img src=images/detail.png title="Transaction Details Add" name="edit" onclick="editdata(\'TransactionDetails.php?tranid={{row.entity.Referenceno}}&up=true&flag=1\')" value="Edit">'}],
        plugins: [new ngGridCsvExportPlugin(csvOpts)],
		showGroupPanel: true,
        showFilter: false,
        enablePaging: true,
        showFooter: true,
		enableCellEdit: false,
        multiSelect: false,
		enableColumnResize: true,
		enableCellSelection: true,
        totalServerItems:'totalServerItems',
        pagingOptions: $scope.pagingOptions,
        filterOptions: $scope.filterOptions,
		jqueryUITheme: true
    };
    
  $scope.addRow = function() {
      $scope.myData.push({Referenceno: "Auto Nomber", Date: "2013-01-01", Sub_Category: "Sub Cat", Business: "Business", Dist_Name: "Customer", Sub_delear: "Sub Delear", Dr_Amount: "Debit", Cr_Amount: "Credit", Bank: "Bank", Branch: "Branch"});
    };
});